<extend name="./public/frame.html"/>
<block name="content">
    <style>
        html, body {
            margin: 0px;
            padding: 0px;
            background: #fff;
        }
        a {
            color: #333;
            text-decoration: none;
        }
        .menu {
            margin: 30px;
            height: calc(100vh - 180px);
            overflow-y: scroll;
        }
        .league_cont_flt {
            float: left;
            width: 210px;
            height: calc(100vh - 60px);
            border: 1px solid #e0e0e0;
            border-radius:3px;
        }
        .league_cont_frt {
            float: right;
            width: calc(100vw - 300px);
            height: calc(100vh - 60px);
            border: 1px solid #e0e0e0;
            border-radius:3px;
        }
        .league_cont_title {
            height: 60px;
            border-bottom: 1px solid #e0e0e0;
        }
        .league_cont_title .lea_tit {
            margin-left: 10px;
            line-height: 60px;
            font-weight: 500;
            font-size: 14px;
            float: left;
        }
        .league_cont_title .lea_but {
            height: 34px;
            line-height: 34px;
            font-size: 14px;
            float: right;
            background: #009999;
            margin: 15px 10px 0px 0px;
            padding: 0px 8px;
            color: #fff;
        }
        .lea_all_tit {
            font-size: 16px;
            margin-left: 20px;
            line-height: 60px;
            font-weight: 500;
        }
        .league_table{ padding:20px;}
        .clear{ clear:both;}
        .dtree{padding:20px 10px;
            font-size:14px;
            overflow-y: scroll;
            height: calc(100vh - 161px);
        }
        .dtree input[type="checkbox"]{ width:0; height:0;}
        .dTreeNode a{vertical-align: top;font-size: 12px;}

        .province{ background:url("../../../../public/images/line.gif") left center repeat-y;}
        .province li{ line-height:28px;}
        .province li a{ display:block;}
        .menu_li{ background:url(../../../../public/images/plus.gif) left center no-repeat;}
        .menu_li_zk{ background:url(../../../../public/images/minus.gif) left center no-repeat;}
        .city_list{background:url(../../../../public/images/line.gif) left center repeat-y;    margin-left: 20px;}
        .city_list li a{background:url(../../../../public/images/minus.gif) left center no-repeat;    padding-left: 20px;}
    </style>
<div class="layui-row">
	<div class="layui-col-md2" style="width: 15%">
		  <div class="league_cont_flt">
	          <div class="league_cont_title"> <span class="lea_tit">加盟商列表</span> <a href="javascript:void(0)" class="lea_but" id="franchisee_add">新增加盟商</a></div>
              <div class="menu">
                  <a href="javascript:void(0)">全部</a>
                  <ul class="province">
                      <?php foreach($listInfo as $key=>$value):?>
                      <li>
                          <a class="menu_li" href="javascript:void(0)" style="padding-left: 20px;" onclick="menuClick(<?php echo $value['region_id'];?>);">
                              <?php echo $value['region_name'];?><?php if(!empty($value['number'])):?>（<?php echo $value['number'];?>）<?php endif;?>
                          </a>
                          <ul class="city_list" id="cityList<?php echo $value['region_id'];?>" style="display: none;">
                              <?php foreach($value['CHILD'] as $val):?>
                              <li>
                                  <a href="javascript:void(0)" onclick="referDeail(<?php echo $val['id'];?>);"><?php echo $val['franchisee_name'];?></a>
                              </li>
                              <?php endforeach;?>
                          </ul>
                      </li>
                      <?php endforeach;?>
                  </ul>
              </div>
              <script>
                  function menuClick(num){
                      $(".city_list").slideUp("slow");
                      var cssValue = $("#cityList"+num).css('display');
                      if(cssValue == 'none'){
                          $("#cityList"+num).slideDown("slow");
                          $("#cityList"+num).parent().find('a.menu_li').addClass('menu_li_zk');
                      }else{
                          $("#cityList"+num).slideUp("slow");
                          $("#cityList"+num).parent().find('a.menu_li').removeClass('menu_li_zk');
                      }
                  }
              </script>
            </div>
	</div>	
	<div class="layui-col-md10">
        <!--<a href="{:url('Franchisee/aabc')}" class="lea_but" id="aabc">数据更新</a>-->
        <table class="layui-table" lay-data="{width:'auto', height:'auto', url:'{:url('Franchisee/index')}', page: true, limit: 10, id:'franchisee'}" lay-filter="franchisee">
            <thead>
            <tr>
                <th lay-data="{checkbox:true, fixed: true}"></th>
                <th lay-data="{field:'id', width:60,align:'center', fixed: true, sort: true}">ID</th>
                <th lay-data="{field:'addressName', width:130,align:'center'}">所属地区</th>
                <th lay-data="{field:'franchisee_name', width:200,align:'center'}">加盟商名称</th>
                <th lay-data="{field:'extendNum', width:100,align:'center'}">推广员人数</th>
                <th lay-data="{field:'recomdNum', width:80,align:'center'}">推荐人数</th>
                <th lay-data="{field:'frAuthNum', width:120,align:'center'}">认证人数(顺风车)</th>
                <th lay-data="{field:'orderNum', width:90,align:'center'}">下单人数</th>
                <th lay-data="{field:'ordersnNum', width:100,align:'center'}">订单数</th>
                <th lay-data="{field:'orderMoney', width:120,align:'center'}">订单总额（元）</th>
                <th lay-data="{field:'switchNum', width:100,align:'center'}">转化率</th>
                <th lay-data="{fixed:'right', toolbar: '#barDemo', width:210, align:'center'}">操作</th>
            </tr>
            </thead>
        </table>
        <div class="layui-hide" id="barDemo">
            <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="detail" style="width: 50px">详情</a>
            <a class="layui-btn layui-btn-xs" lay-event="edit" style="width: 50px">修改</a>
            <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del" style="width: 50px">删除</a>
        </div>
	</div>
</div>

    <script>
        layui.use(['table'], function () {
            var table = layui.table;
            //点击添加加盟商
            $(document).on('click', '#franchisee_add', function(){
                layer.open({
                    type: 2,
                    title: '新增加盟商',
                    shadeClose: true,
                    shade: 0.8,
                    area: ['1000px', '65%'],
                    content: '{:url("/admin/Franchisee/franchisee_add")}'
                });
            })

            table.on('tool(franchisee)', function (obj) {
                var data = obj.data;
                var id = data.id;
                if (obj.event === 'del') {
                    layer.confirm('确定删除吗?',function(index){
                        var url = '{:url("/admin/Franchisee/franchisee_del","id=")}' + id
                        $.get(url,function(data){
                            if(data.code == 1){
                                layer.msg(data.msg,{'icon':1});
                                window.location.reload();
                            }else{
                                layer.msg(data.msg,{'icon':2});
                            }
                        },'json')
                        layer.close(index);
                    })

                } else if (obj.event === 'edit') {
                    layer.open({
                        type: 2,
                        title: '加盟商修改',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['1000px', '65%'],
                        content: '{:url("/admin/Franchisee/franchisee_edit","id=")}' + id //iframe的url
                    });

                } else if (obj.event === 'detail') {
                    layer.open({
                        type: 2,
                        title: '加盟商详情',
                        shadeClose: true,
                        shade: 0.8,
                        area: ['100%', '100%'],
                        content: '{:url("/admin/Franchisee/franchisess_detail","id=")}' + id //iframe的url
                    });
                }
            });
            //点击搜索
            /*$('.layui-btn').on('click', function () {
                var name = $("#name").val();
                table.reload('CarBrand', {
                    url: '/admin/CarBrand/index', where: {
                        "name": name,
                    }
                });
            })*/
        });
        function referDeail(id){
            layer.open({
                type: 2,
                title: '加盟商详情',
                shadeClose: true,
                shade: 0.8,
                area: ['100%', '100%'],
                content: '{:url("/admin/Franchisee/franchisess_detail","id=")}' + id //iframe的url
            });
        }
    </script>
</block>